<script setup lang="ts">
  import { ref } from 'vue';

  let visible = ref(true);
  let text = ref('test');
</script>

<template>
  <div class="q-pa-md q-gutter-sm  tr-help-demo">
  <t-help
    label='我是从左侧弹出的提示'
    content='这是一个提示，点击我弹出提示'
    helpPlacement='left'
  >
  </t-help>
    <t-help
    label='我是从右侧弹出的提示'
    content='这是一个提示，点击我弹出提示'
    helpPlacement='right'
  >
  </t-help>
    <t-help
    label='我是从上侧弹出的提示'
    content='这是一个提示，点击我弹出提示'
    helpPlacement='top'
  >
  </t-help>
    <t-help
    label='我是从下侧弹出的提示'
    content='这是一个提示，点击我弹出提示'
    helpPlacement='bottom'
  >
  </t-help>

  </div>
</template>

<style>
  .tr-help-demo{
  display: flex;
  flex-direction: column;
}
</style>
